import { StateCreator } from 'zustand';
import { preference } from '@/api';
import { AppStore } from '.';

/**
 * 全局设置
 */
export interface IdeSetting {
  setting: {
    editorLineHeight?: string;
    editorFontSize?: string;
    editorTheme: string; // keyof typeof theme;
    keymap?: string;
    locale?: string;
    theme: string;
    user_id?: number;
    workspace?: string;
  };
  fontSizes: Array<string>;
  lineHeights: Array<string>;
  themes: Array<string>;
  editorThemes: Array<string>;
}

const initData: IdeSetting = {
  setting: {
    theme: 'dark',
    editorTheme: 'vscodeDark'
  },
  fontSizes: ['12px', '14px', '16px', '18px', '20px', '22px', '24px', '26px', '28px', '30px'],
  lineHeights: ['16px', '18px', '21px', '23px', '25px', '27px', '30px', '32px', '34px', '36px'],
  themes: ['dark'],
  editorThemes: [
    'androidstudio',
    'atomone',
    'aura',
    'bbedit',
    'bespin',
    'darcula',
    'dracula',
    'duotoneDark',
    'duotoneLight',
    'eclipse',
    'githubDark',
    'githubLight',
    'gruvboxDark',
    'gruvboxLight',
    'material',
    'materialDark',
    'materialLight',
    'noctisLilac',
    'nord',
    'okaidia',
    'solarizedDark',
    'solarizedLight',
    'sublime',
    'tokyoNight',
    'tokyoNightDay',
    'tokyoNightStorm',
    'vscodeDark',
    'xcodeDark',
    'xcodeLight']
};
export type IdeSettingStore = IdeSetting & {
  setIdeSetting: (setting: Partial<IdeSetting['setting']>) => void;
  updateIdeSetting: (setting: Partial<IdeSetting['setting']>) => Promise<any>;
};

export const settingStore: StateCreator<IdeSettingStore> = (set, get) => ({
  ...initData,
  setIdeSetting: (setting) => set((state) => ({
    setting: {
      ...state.setting,
      ...setting
    }
  })),
  updateIdeSetting: async (setting) => {
    const stat = get() as AppStore;
    await preference({
      ...stat.setting,
      ...setting
    });
    set({
      setting: {
        ...stat.setting,
        ...setting
      }
    });
  }
});
